<div ng-controller="CrearTransaccionBovedaCajaController">
    <fieldset>
        <legend>Transacci&oacute;n Boveda - Caja</legend>

        <alert ng-repeat="alert in alerts" type="{{alert.type}}" close="closeAlert($index)">
            {{alert.msg}}
        </alert>

        <form name="formCrearTransaccionBovedaCaja" ng-submit="crearTransaccion()" novalidate>
            <div class="row">
                <div class="col-sm-6">
                    <div class="form-group" ng-class="{ 'has-error' : formCrearTransaccionBovedaCaja.boveda.$invalid && control.submitted}">
                        <label>Boveda</label>
                        <label style="color: brown;">(*)</label>
                        <select focus-on="focusBoveda" name="boveda" ng-options="boveda.id as boveda.denominacion for boveda in combo.boveda" ng-model="view.idBoveda" class="form-control" required autofocus>
                        	<option value="">--Seleccione--</option>
                        </select>
                        <div ng-show="formCrearTransaccionBovedaCaja.boveda.$invalid && control.submitted">
                            <p class="help-block" ng-show="formCrearTransaccionBovedaCaja.boveda.$error.required">
                                Ingrese Boveda.
                            </p>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="form-group" style="height: 59px;">
                        <label>&nbsp;</label>
                        <div class="form-control-static">
                            <button type="button" class="btn btn-default" ng-click="loadDetalleBoveda()">
                                <span class="glyphicon glyphicon-search"></span>
                            </button>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-8">
                    <div class="form-group">
                        <label>Detalle</label>
                        <label style="color: brown;">(*)</label>
                        <table class="table table-striped table-bordered table-condensed">
                            <thead>
                            <tr>
                                <th>Denominaci&oacute;n</th>
                                <th>Cantidad</th>
                                <th>Subtotal</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr ng-repeat="detalle in objetosCargados.detalles">
                                <td style="width: 20%;">
                                    <span ng-bind="detalle.valor | currency: boveda.moneda.simbolo"/>
                                </td>
                                <td style="width: 35%;">
                                    <ng-form name="cantidadForm">
                                        <div class="form-group" ng-class="{ 'has-error' : cantidadForm.cantidad.$invalid && control.submitted}" style="margin-bottom: 0px;">
                                            <input type="number" name="cantidad" ng-model="detalle.cantidad" class="form-control" required style="height: 27px;padding: 0px 12px;"/>
                                            <div ng-show="cantidadForm.cantidad.$invalid && control.submitted">
                                                <p class="help-block" ng-show="cantidadForm.cantidad.$error.required">
                                                    Ingrese cantidad.
                                                </p>
                                            </div>
                                        </div>
                                    </ng-form>
                                </td>
                                <td style="width: 45%;">
                                    <span>{{detalle.valor*detalle.cantidad | currency: boveda.moneda.simbolo}}</span>
                                </td>
                            </tr>
                            </tbody>
                            <tfoot>
                            <tr ng-class="{'danger': total() == 0 || total() === undefined}">
                                <td colspan="2">
                                    Total: <span ng-bind="total() | currency : ''"></span>
                                </td>
                                <td ng-show="total() == 0 || total() === undefined">
                                    Invalido
                                </td>
                            </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>
            </div>
            <button type="submit" class="btn btn-primary">Guardar</button>
            <button type="button" ng-click="cancelar()" class="btn btn-default">Cancelar</button>
        </form>
    </fieldset>

</div>